﻿@using MyWebProject.Models.QueryResult;
@using MyWebProject.Models.Entity;
@{
    List<SnippetResult> list = Model as List<SnippetResult>;
}
<div style="border:1px solid rgba(128, 128, 128, 0.41);margin-left: -15px; margin-right: -15px;">
    <div class="row" style="margin-left: 0px; margin-right: 0px;">
        <table class="table table-hover table-bordered">
            <thead>
                <tr class="success">
                    <th>主标题</th>
                    <th>副标题</th>
                    <th>标签</th>
                    <th>正文</th>
                    <th>编辑</th>
                </tr>
            </thead>
            <tbody>
                @foreach (SnippetResult s in list)
                {
                    <tr>
                        <td style="max-width:100px">@s.MAIN_TITLE</td>
                        <td style="max-width:100px">@s.SECOND_TITLE</td>
                        <td style="max-width:100px">
                            @foreach (TAG_INFO t in s.tag_info)
                            {
                                <a href="javascript:void(0)" onclick="searchPost('@t.TAG_NAME')"><span class="label label-primary">@t.TAG_NAME</span></a> }
                        </td>
                        <td style="max-width:300px">@s.POST_CONTENT</td>
                        <td style="max-width:100px">
                            <div class="btn-group">
                                <button class="btn btn-default">选项</button>
                                <button data-toggle="dropdown" class="btn btn-default dropdown-toggle"><span class="caret"></span></button>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="javascript:void(0)" onclick="modPost(@s.POST_ID)">修改</a>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0)">隐藏</a>
                                    </li>
                                    <li class="divider">
                                    </li>
                                    <li>
                                        <a href="javascript:void(0)" onclick="addPost()">新增</a>
                                    </li>
                                    <li>
                                        <a href="javascript:void(0)" onclick="delPost(@s.POST_ID)">删除</a>
                                    </li>
                                </ul>
                            </div>
                        </td>
                    </tr>}
            </tbody>
        </table>
    </div>
    <div class="row" style="margin-left: 5px; margin-right: 5px;">
        <div class="fixed-table-pagination">
            <div class="pull-left pagination-detail" style="font-size:small">
                <span class="pagination-info">显示</span>
                <span class="page-list">
                    <span class="btn-group-sm dropup">
                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                            <span id="pageSize" class="page-size">@ViewData["pageSize"]</span>
                            <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" role="menu">
                            <li class="active"><a href="javascript:void(0)" onclick="modifyPageSize(10)">10</a></li>
                            <li><a href="javascript:void(0)" onclick="modifyPageSize(25)">25</a></li>
                            <li><a href="javascript:void(0)" onclick="modifyPageSize(50)">50</a></li>
                        </ul>
                    </span>行/页
                </span>
            </div>
            <div class="pull-right pagination" style="margin-top: 0px; margin-bottom: 0px;">
                <ul class="pagination-small" style="margin-top: 0px; margin-bottom: 0px;"></ul>
            </div>
        </div>
    </div>
</div>
<input style="visibility:collapse" id="saveStartPage" value="@ViewData["saveStartPage"]" />
<div id="ueDiv" class="row" style="visibility:hidden;border:1px solid rgba(128, 128, 128, 0.41);">
    <div class="row" style="height:40px;margin-bottom:20px">
        &nbsp;  &nbsp;&nbsp;  &nbsp;主标题 : <input id="postTitle" />
        副标题 : <input id="postSecondTitle" />
        &nbsp;置顶 :
        <a href="javascript:void(0)" onclick="changeTop()"><span id="isTopPost" class="label label-default">否</span></a>
        &nbsp;标签 : &nbsp;
        <div class="btn-group btn-group-xs">
            <ul class="pagination pagination-sm" id="tagSelect"></ul>
        </div>
    </div>
    <a name="UEedit"></a>
    <div id="UEedit" style="min-height:400px">
    </div>
    <h3 class="b3">
        <a class="pull-right label label-primary" style="margin-right:5px;margin-bottom:10px" href="javascript:void(0)" onclick="savePost()">保存</a>
        <a class="pull-right label label-default" style="margin-right:5px;margin-bottom:10px" href="javascript:void(0)" onclick="cancelSavePost()">取消</a>
    </h3>
    <input id="selectPostId" style="visibility:collapse" />
</div>

<!--百度富文本开始-->
<!-- 配置文件 -->
<script type="text/javascript" src="~/Content/js/UEditor/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="~/Content/js/UEditor/ueditor.all.js"></script>
<!--定义百度富文本绑定的变量进行修改-->
<script type="text/javascript">
    //需要配置ueditor.config.js中UE编辑器路径
    //var URL = window.UEDITOR_HOME_URL || getUEBasePath()||'./Content/js/UEditor/';
    var editor = UE.getEditor('UEedit');
</script>
<!--百度富文本结束-->
<!-- 实例化编辑器 -->
<script type="text/javascript">
    //取消保存
    function cancelSavePost() {
        $("#ueDiv").css("visibility", "collapse");
    }
    //修改置顶
    function changeTop() {
        if ($("#isTopPost").html() == '否') {
            $("#isTopPost").html('是');
            $("#isTopPost").attr("class", "label label-success");
        } else {
            $("#isTopPost").html('否');
            $("#isTopPost").attr("class", "label label-default");
        }
    }
    //切换标签选中状态样式
    function changeSelectedStatus(tag) {
        var attr = $(tag).parent().attr("class")
        if (attr == "active") {
            $(tag).parent().attr("class", "")
        } else {
            $(tag).parent().attr("class", "active")
        }
    }
    //保存修改(用于新增或修改)
    function savePost() {
        var tags = "";
        $("#tagSelect .active").each(function () {
            tags += $(this).val() + ',';
        });
        if (tags == "" || $("#postTitle").val() == "" || $("#postSecondTitle").val() == "" || editor.getContent()=="") { alert("请检查tag标签,主标题,副标题,正文是否有空"); return; }
        tags = tags.substring(0, tags.length - 1);
        $.post('Management/saveModifyPost', {
            'postTitle': $("#postTitle").val(),
            'postSecondTitle': $("#postSecondTitle").val(),
            'tags': tags,
            'selectPostId': $("#selectPostId").val(),
            'isTop': $("#isTopPost").html() == '否' ? '0' : '1',
            'postContent': encodeURI(editor.getContent())
        }, function (data) {
            if (data != "success") {
                alert("保存失败!");
            } else {
                alert("保存成功!");
                getManagerDataGrid($("#saveStartPage").val());
            }
        });
    }
    //生成tag标签
    function setTagArry(tagArray, selectedTags) {
        $("#tagSelect").children().remove();
        for (var i = 0; i < tagArray.length; i++) {
            if ($.inArray(tagArray[i].TAG_ID + '', selectedTags) > -1) {
                $("#tagSelect").append('<li class="active" value="' + tagArray[i].TAG_ID + '"><a href="javascript:void(0)" onclick="changeSelectedStatus(this)">' + tagArray[i].TAG_NAME + '</a></li>')
            } else {
                $("#tagSelect").append('<li class="" value="' + tagArray[i].TAG_ID + '"><a href="javascript:void(0)" onclick="changeSelectedStatus(this)">' + tagArray[i].TAG_NAME + '</a></li>')
            }
        }
    }
    //下拉菜单添加事件,用于从后台获取文章数据,绑定到富文本编辑器
    function addPost() {
        location.href = "#UEedit";
        $.post('Management/addPost', function (json) {
            var json = eval("(" + json + ")");
            setTagArry(json);
            editor.setContent("");//上面定义的富文本变量editor
            $("#postTitle").val("");
            $("#postSecondTitle").val("");
            $("#ueDiv").css("visibility", "visible");
        });
    }
    //下拉菜单修改事件,用于从后台获取文章数据,绑定到富文本编辑器,比添加多了一些数据绑定
    function modPost(postId) {
        $.post('Management/getPostDetial?postId=' + postId, function (data) {
            var json = eval("(" + data + ")");
            $("#ueDiv").css("visibility", "visible");
            location.href = "#UEedit";
            editor.setContent(json.detial.POST_CONTENT);//上面定义的富文本变量editor
            $("#postTitle").val(json.detial.MAIN_TITLE.trim());
            if (json.detial.IS_TOP) {
                $("#isTopPost").html('是');
                $("#isTopPost").attr("class", "label label-success");
            } else {
                $("#isTopPost").html('否');
                $("#isTopPost").attr("class", "label label-default");
            }
            $("#postSecondTitle").val(json.detial.SECOND_TITLE.trim());
            var selectedTags = new Array();
            selectedTags = json.detial.TAG_ID.split(",");
            setTagArry(json.tagInfo, selectedTags);
            $("#selectPostId").val(postId)
        });
    }
    //删除文章
    function delPost(postId) {
        if (window.confirm("确认删除?")) {
            $.post('Management/delPost', {
                'postId': postId
            }, function (data) {
                if (data != "success") {
                    alert("删除失败!");
                    return;
                }
                getManagerDataGrid($("#saveStartPage").val());
            });
        } else {
            return;
        }
    }
    //修改每页显示行数触发事件
    function modifyPageSize(size) {
        $("#pageSize").html(size);
        getManagerDataGrid($("#saveStartPage").val());
    }
    //获取文章列表
    function getManagerDataGrid(pageStart) {
        var menuId = $(".list-group-item.active").attr("id");
        var pageSize = $("#pageSize").html();
        pageSize = parseInt(pageSize) == 0 ? 10 : pageSize;
        pageStart = parseInt(pageStart) == 0 || parseInt(pageStart) < 0 ? 1 : pageStart;
        $.post("Management/Grid", {
            "pageSize": pageSize,
            "pageStartNum": pageStart,
            "menuId": menuId
        }, function (data) { $("#grid").html(data); setPagination(pageStart) });
    }
    //设置文章列表页码
    function setPagination(pageStart) {
        if (isNullOrEmpty(pageStart) || pageStart < 1) {
            pageStart = 1;
        }
        //生成当前页码
        var html = '<li><a href="javascript:void(0)" onclick="getManagerDataGrid(' + parseInt(pageStart - 5) + ')"><<</a></li>';
        for (var i = 0; i < 5; i++) {
            html += '<li><a href="javascript:void(0)" onclick="getManagerDataGrid(' + (parseInt(pageStart) + parseInt(i)) + ')">' + (parseInt(pageStart) + i) + '</a></li>';
        }
        html += '<li><a href="javascript:void(0)" onclick="getManagerDataGrid(' + (parseInt(pageStart) + 5) + ')">>></a></li>';
        $('.pagination-small').html(html);
    }
    function load() {
        setPagination($("#saveStartPage").val());
    }
    load();
</script>
